<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>
    <div style="width: 89%; height: 5rem; color: #fff;">
        <h1>用户列表</h1>
        <!-- <p>用户名: <span id="nowuser"></span></p> -->
    </div>
    <div class="box">
        
        <table border="1" style="width: 90rem; color: #fff; margin: auto;">
        <thead>
            <tr>
                <th>ID</th>
                <th>用户名</th>
                <th>密码</th>
                <th>邮箱</th>
                <th>更新时间</th>
                <th>结束时间</th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
    </div>
    
    

</body>
<script>
   $(function () {
        // if(document.referrer.includes('http://127.0.0.1:5501/3dd/%E4%BD%9C%E4%B8%9A/11.21%E5%8F%B7%E4%BD%9C%E4%B8%9A/%E6%B3%A8%E5%86%8C%E7%99%BB%E5%BD%95%E9%A1%B5%E9%9D%A2.html')){
        //     let search = window.location.search
        //     nowuser.innerHTML = search.split('&')[0].split('=')[1]
        // } else {
        //     alert('请先登录')
        //     window.location.href = 'http://127.0.0.1:5501/3dd/%E4%BD%9C%E4%B8%9A/11.21%E5%8F%B7%E4%BD%9C%E4%B8%9A/%E6%B3%A8%E5%86%8C%E7%99%BB%E5%BD%95%E9%A1%B5%E9%9D%A2.html'
        // }
       fun() 
    })
    

    function fun() {
        $.ajax({
            type: 'GET',
            url: 'https://liu.zzgoodqc.cn/users',
            dataType: 'json',
            success: function (res) {
                console.log(res);
                var str = ''
                for (let i in res.data) {
                    str += `
                                <tr>
                                     <td>${res.data[i].id}</td>
                                     <td>${res.data[i].name}</td>
                                     <td>${res.data[i].password}</td>
                                     <td>${res.data[i].email}</td>
                                     <td>${res.data[i].created_at}</td>
                                     <td>${res.data[i].updated_at}</td>
                                
                                </tr>
                                `
                }
                $('tbody:eq(0)').html(str)
            }
        })
        
    }

</script>
<style>
    *{
        padding: 0;
        margin: 0;
    }
    th, td{
        width: 4rem;
        text-align: center;
    }
    table{
        border: 1px solid #fff;
    }
    body {
        width: 100%;
        height: 49rem;
        background: url('http://pic.bizhi360.com/bbpic/97/11097.jpg') no-repeat;
        background-size: 100% 100%;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        align-items: center;
    }
    .box{
        width: 90%;
        height: 100%;
        background: url('http://pic.bizhi360.com/bbpic/97/11097.jpg') no-repeat;
        background-size: 100% 100%;
        /* //隐藏水平滚动条 */
        overflow-x:hidden; 
    }
</style>
</html>